<template>
	<wsPage title="菜单资源管理">
		<div slot="page_operate">
			<Button @click="init"><Icon type="refresh"></Icon><span>刷新</span></Button>
			<Button @click="goBack"><Icon type="ios-arrow-back"></Icon><span>返回</span></Button>
		</div>
		
		<wsSmPanel :page="table.page">
			<div slot="list_operate">
				<Button @click="showAddModal">新增权限</Button>
			</div>
			<div slot="list_data">
				<Table :columns="table.columns" :data="table.datas"></Table>
			</div>
		</wsSmPanel>
		
		<!--新增弹框-->
		<wsModal v-model="modal1.show" ok-text="保存" :title="modal1.title" @on-ok="saveModal1" @on-cancel="cancelModal1">
		    <Form ref="modal1" :model="modal1.model" :rules="modal1.rules" :label-width="100">
		        <FormItem label="权限名称" prop="name">
		            <Input v-model="modal1.model.name" placeholder=""></Input>
		        </FormItem>	
		        <FormItem label="权限CODE" prop="code">
		            <Input v-model="modal1.model.code" placeholder=""></Input>
		        </FormItem>	
		        <FormItem label="权限类型">
		        	<RadioGroup v-model="modal1.model.type">
		        		<Radio :label="1">方法权限</Radio>
		        		<Radio :label="2">URL权限</Radio>
		        	</RadioGroup>
		        </FormItem>	
		        <FormItem label="服务URL" v-if="modal1.model.type == 2">
		            <Input v-model="modal1.model.serviceUrl" placeholder=""></Input>
		        </FormItem>	
		        <FormItem label="权限描述">
		            <Input v-model="modal1.model.wDesc" type="textarea"></Input>
		        </FormItem>	
		    </Form>			
		</wsModal>		
	</wsPage>
</template>

<script>
	import Util from '../../../common/util.js';
	export default {
		data() {
			return {
				table: {
					columns: [
					{
						title: '编号',
						key: 'id',
						width: 60
					},
					{
						title: '权限名称',
						key: 'name'
					},
					{
						title: '权限CODE',
						key: 'code'
					},
					{
						title: '权限类型',
						width: 120,
						render: (h, params) => {
							let props_ = {};
							if(params.row.type == 1) {
								props_.color = 'blue';
							}
							return h('Tag', {
								props: props_
							},params.row.type == 1 ? '方法' : 'URL')
						}
					},
					{
						title: '操作',
						align: 'center',
						width: 150,
						render: (h, params) => {
                            return h('div', [
                                 h('Button', {
                                    props: {
                                        type: 'text',
                                        size: 'small'
                                    },
                                    on: {
                                    	click: () => {
                                    		let row_ = params.row;
                                    		this.showEditModal(row_);
                                    	}
                                    }
                                }, '编辑'),
                                h('Button', {
                                    props: {
                                        type: 'text',
                                        size: 'small'
                                    },
                                    on: {
                                    	click: () => {
                                    		let row_ = params.row;
                                    		this.delConfirm(row_);
                                    	}
                                    }
                                }, '删除')
                            ]);
                        }
					}],
					datas: [],
					page: {
						total: 0, //总条数
						pageNum: 1, //当前页
						pageSize: 10 //每页显示条数
					}
				},
				form: {
					resourceId: '' //菜单资源编号
				},
				//新增弹框
				modal1: {
					show: false,
					title: '添加权限',
					model: {
						id: null,
						name: '',
						code: '',
						wDesc: '',
						resourceId: '',
						type: 1, //1.方法缺陷 2.URL权限
						serviceUrl: ''
					},
					rules: {
						name: [
							{ required: true, message: '请输入权限名称'}
						],
						code: [
							{ required: true, message: '请输入权限CODE'}
						]
					}
				}
			}
		},
		computed: {
			/**
			 * 当前的modal1是否为编辑状态
			 */
		    isEdit() {
		      return !Util.vad.isBlank(this.modal1.model.id);
		    }
		},
		mounted() {
			this.initParams();
			this.init();
		},
		methods: {
			/**
			 * 初始化参数
			 */
			initParams() {
				let resourceId = this.$route.params.resourceId;
				let rsv_ = this.$route.params.rsv_;
				this.form.resourceId = resourceId;
			},
			/**
			 * 初始化
			 */
			init() {
				const _this = this;
				let resourceId_ = this.form.resourceId;
				let pageSize_ = this.table.page.pageSize;
				let pageNum_ = this.table.page.pageNum;
				this.axios.get('/ws/sys/resource/' + resourceId_ + '/permissions/' + pageSize_ + '/' + pageNum_).then(function(response) {
					let res = response.data;
					if(0 === res.meta.code) {
						_this.buildTableData(res.data);
					} else {
						
					}
				});
			},
			/**
			 * 构建表格数据
			 */
			buildTableData(data_) {
				this.table.datas = data_.list;
				this.table.page.total = data_.total;
			},
			/**
			 * 初始化编辑
			 */
			initEdit(row_) {
				const _this = this;
				let cId_ = row_.id;
				let rsv_ = row_.rsv_;
				this.axios.get('/ws/sys/resource/permission/' + cId_ + '/' + rsv_).then(function(response) {
					let res = response.data;
					if(0 === res.meta.code) {
						_this.buildEditData(res.data);
					} else {
						let message_ = res.meta.message;
						_this.$Message.warning('初始化编辑操作失败:' + message_);
					}
				});				
			},
			/**
			 * 构建编辑数据
			 */
			buildEditData(data_) {
				this.modal1.model = {
					id: data_.id,
					name: data_.name,
					code: data_.code,
					wDesc: data_.wDesc,
					resourceId: data_.resourceId,
					type: data_.type, //1.方法缺陷 2.URL权限
					serviceUrl: data_.serviceUrl
				};
			},
			/**
			 * 初始化新增
			 */
			initAdd() {
				this.modal1.model = {
					id: null,
					name: '',
					code: '',
					wDesc: '',
					resourceId: '',
					type: 1, //1.方法缺陷 2.URL权限
					serviceUrl: ''
				};
			},
			/**
			 * 显示新增弹框
			 */
			showAddModal() {
				this.modal1.show = true;
				this.modal1.title = '添加权限';
				this.initAdd();
			},
			/**
			 * 显示编辑弹框
			 */
			showEditModal(row_) {
				this.modal1.show = true;
				this.modal1.title = '修改权限';
				this.initEdit(row_);
				console.log(this.modal1.model);
			},
			/**
			 * 保存弹框1内容
			 */
			saveModal1() {
				this.$refs['modal1'].validate((valid) => {
                    if (valid) {
                        this.submitModal1();
                    } 
                });			
			},
			/**
			 * 提交表单
			 */
			submitModal1() {
				if(this.isEdit) {
					this.editModal1Data();
				} else {
					this.saveModal1Data();
				}
			},
			/**
			 * 保存模态框1数据
			 */
			saveModal1Data() {
				let postData_ = this.modal1.model;
				const _this = this;
				let resourceId_ = this.form.resourceId;
				postData_.resourceId_ = resourceId_;
				this.axios.post('/ws/sys/resource/permission', postData_).then(function(response) {
					let res = response.data;
					if(0 === res.meta.code) {
						_this.$Message.success('添加资源权限成功');
						_this.cancelModal1();
						_this.init();
					} else {
						let message_ = res.meta.message;
						_this.$Message.warning('添加资源权限失败:' + message_);
					}
				});
			},
			/**
			 * 编辑数据字典
			 */
			editModal1Data() {
				let postData_ = this.modal1.model;
				const _this = this;
				let resourceId_ = this.form.resourceId;
				postData_.resourceId_ = resourceId_;
				this.axios.put('/ws/sys/resource/permission', postData_).then(function(response) {
					let res = response.data;
					if(0 === res.meta.code) {
						_this.$Message.success('修改资源权限成功');
						_this.cancelModal1();
						_this.init();
					} else {
						let message_ = res.meta.message;
						_this.$Message.warning('修改资源权限失败:' + message_);
					}
				});
			},
			/**
			 * 取消弹框1
			 */
			cancelModal1() {
				this.$refs['modal1'].resetFields();
				this.modal1.show = false;
			},
			/**
			 * 删除提示
			 */
			delConfirm(row_) {
				const _this = this;
				this.$confirm({
        			title: '操作提示',
        			width: 300,
        			content: '你确认删除本行记录吗?',
        			onOk: function() {
        				_this.delTableRow(row_);
        			}
        		});				
			},
			/**
			 * 删除数据字典项目
			 */
		    delTableRow(rowItem_) { //删除行
		      let rId_ = rowItem_.id;
		      let rsv_ = rowItem_.rsv_;
		      const _this = this;
		      this.axios.delete('/ws/sys/resource/permission/' + rId_ + '/' + rsv_).then(function(response) {
		      		let res = response.data;
					if(0 === res.meta.code) {
						_this.$Message.success('删除资源权限记录成功');
						_this.init();
					} else {
						let message_ = res.meta.message;
						_this.$Message.warning('删除资源权限记录失败:' + message_);
					}
		      });
		    },
		   /**
		    * 返回
		    */
		   goBack() {
		   	this.$router.push({name: 'sys_resource_list'});
		   }
		}
	}
</script>

<style>

</style>